<?php
defined('IN_XLP') or die('Access Denied');
$Document = array(
    'pageid'   => 'app-index', //页面标示
    'pagename' => 'APP首页配置', //当前页面名称
    'mycss'    => array(), //加载的css样式表
    'myjs'     => array(), //加载的js脚本
    'footerjs' => array('global/baidu.template'),
    'head'     => true, //加载头部文件
);
include getTpl('header', 'public');
?>
<style>
tr th,tr td{text-align:center}
.left{float:left;}
.right{float:right;}
.txl{text-align:left}
.red{color:red;}
.pointer{cursor:pointer;}
.underline{text-decoration:underline;font-weight:bold;}
</style>
<!--顶部导航 开始-->
<?php include getTpl('top', 'public');?>
<!--顶部导航 结束-->
<!--左侧菜单 开始-->
<?php include getTpl('nav', 'public');?>
<!--左侧菜单 结束-->
<!--主体 开始-->
<!-- content -->
<section id="content">
    <!-- main padder -->
    <section class="main padder">
        <div class="clearfix">
            <h4><i class="fa fa-table"></i>首页栏目</h4>
            <section class="panel">
                    <div class="panel-body">
                        <div class="block">
                            <div id="tab" class="btn-group">
                                <?php foreach ($tab as $k => $v): ?>
                                <a href="#<?php echo $k ?>" class="btn"><?php echo $v['name'] ?></a>
                                <?php endforeach ?>
                            </div>
                            <div class="input-group right">
                                <a id="add" class="btn btn-sm btn-info" data-toggle="modal" href="javascript:;">
                                    <i class="fa fa-fw fa-plus"></i>添加内容
                                </a>
                            </div>
                        </div>
                    </div>

                    <div class="table-responsive">
                        <table id="table" class="table table-striped b-t text-small">

                            <script id="tpl" type="text/html">
                            <thead>
                                <tr>
                                    <th width="80">序号</th>
                                    <th width="200">服务社</th>
                                    <th width="150">位置</th>
                                    <th width="200">标题</th>
                                    <th width="350">图片</th>
                                    <th width="">类别</th>
                                    <th width="">参数</th>
                                    <th width="">开始时间</th>
                                    <th width="">结束时间</th>
                                    <th width="100">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                            <% for (var i in data) { %>
                                <tr>
                                    <td></td>
                                    <td><%=data[i].service%></td>
                                    <td><%=data[i].order%></td>
                                    <td><%=data[i].title%></td>
                                    <td>
                                    <% if(data[i].image) { %>
                                        <a class="pointer" href="<%=data[i].image%>" target="_blank">
                                            <img src="<%=data[i].image%>" height="100">
                                        </a>
                                    <% } else { %>
                                        没有图片...
                                    <% } %>
                                    </td>
                                    <td><%=data[i].mode%></td>
                                    <td><%=data[i].para%></td>
                                    <td><%=data[i].starttime%></td>
                                    <td><%=data[i].endtime%></td>
                                    <td>
                                        <div class="btn-group"> 
                                            <button class="btn btn-white btn-xs dropdown-toggle" data-toggle="dropdown">操作<span class="caret"></span></button> 
                                            <ul class="dropdown-menu">
                                                <li><a href="<?php echo U('app/edit') ?><%='?id='+i%>">编辑</a></li>
                                                <li><a href="javascript:;" onclick="del('<%=i%>',this);" class="delete">删除</a></li>
                                            </ul>
                                        </div>
                                    </td>
                                </tr>
                            <% } %>
                            </tbody>
                            </script>

                        </table>
                    </div>
            </section>
        </div>
    </section>
    <!--/ main padder -->
</section>
<!--/ content -->
<!--主体 结束-->
<script>
var add      = "<?php echo U('app/add') ?>";
var add_url  = add + '?id=0';
var data_url = "<?php echo U('app/get_data') ?>";
var del_url  = "<?php echo U('app/del') ?>";

$(function(){
    //模版布局
    var tpl = baidu.template('tpl');

    var $table = $('#table');
    var hash = get_hash(self.location.hash);
    get_data($table, hash);
    btn_white(hash);

    //切换标签页
    $('#tab a').click(function(e){
        //锚点
        var hash = get_hash(e.target.hash);
        add_url = add + '?id=' + hash;
        get_data($table, hash);
        btn_white(hash);
    });

    $('#add').click(function(){
        self.location.href = add_url;
    });

    //获取各层数据
    function get_data($node, index) {
        $.get(data_url, {"layout": index}, function(res){
            if(res.status==1) {
                var len = res.data.length;
                if(len==undefined) {
                    $node.html(tpl({"data":res.data}));
                } else {
                    $node.html('<div style="width:100px;margin:20px auto;">暂无数据...</div>');
                }
            } else {
                Msg.error(res.info);
            }
        }, 'JSON');
    }
    
});


function del(_id, t) {
    if(!confirm('真的要删除此条数据吗？')) {
        return false;
    }
    $this = $(t);
    $.get(del_url, {"id":_id}, function(res){
        if(res.status==1) {
            $this.closest('tr').remove();
        } else {
            Msg.error(res.info);
        }
    }, 'JSON');
}

function get_hash(hash) {
    return (hash=="" || hash==undefined) ? 0 : hash.substring(1);
}

function btn_white(index) {
    var btns = $('#tab a');
    var len = btns.length;
    for (var i=0;i<len;i++) {
        if(i==index) {
            $(btns[i]).removeClass('btn-white');
            $(btns[i]).css('color','#FFF');
        } else {
            $(btns[i]).addClass('btn-white');
            $(btns[i]).css('color','#657483');
        }
    }
}
</script>
<?php include getTpl('footer', 'public'); ?>